<template>
    <div style="background-color: #fff;margin: 20px;padding: 20px;">
        <div>
            <h1 class="title">知识库 - {{ kdbInfo?.kdb?.name }}</h1>
        </div>
        <el-row :gutter="20">
            <el-col :span="10">
                <div>
                    <h1 class="title">上传文档</h1>
                    <el-upload drag :action="VITE_UPLOAD_API_BASE_URL" :data="{ 'id': id }"
                        :on-success="uploadFileSucess" :show-file-list="true" name="fileList" accept=".pdf, .doc, .docx, .txt" multiple>
                        <el-icon class="el-icon--upload"><upload-filled /></el-icon>
                        <div class="cm-upload-text">
                            点击或拖动文件附件到此处上传
                        </div>
                        <div class="el-upload__tip">
                            支持 .pdf, .doc, .docx, .txt类型
                        </div>
                    </el-upload>
                </div>
                <div>
                    <h1 class="title">已上传文件列表</h1>
                    <el-table :data="kdbInfo.fileList" max-height="400">
                        <template #empty>
                            <el-empty description="暂无知识库，快去创建吧~" />
                        </template>

                        <el-table-column prop="fileName" label="ID"></el-table-column>
                    </el-table>
                </div>
            </el-col>
            <el-col :span="14">
                <h1 class="title">知识列表</h1>
                <el-table :data="kdbInfo?.kdb?.kList" max-height="800">
                    <template #empty>
                        <el-empty description="暂无知识，快去上传文件吧~" />
                    </template>
                    <el-table-column prop="id" label="ID" :width="100"></el-table-column>
                    <el-table-column prop="content" label="知识条目"></el-table-column>
                    <el-table-column prop="create_time" label="训练时间" :width="100"></el-table-column>
                        <el-table-column prop="file_name" label="来源" :width="100">
                        <template #default="scope">
                            <el-link
                                :href="`${imgBaseURL}/${scope.row.kdb_id}/${scope.row.file_name}`">{{
                                    scope.row.file_name }}</el-link>
                        </template>
                    </el-table-column>
                    <el-table-column prop="download_url" label="oss相对目录"></el-table-column>
                </el-table>
            </el-col>
        </el-row>
    </div>
</template>
<script>
import { POST } from '../../util/axios.js'
export default {
    data() {
        return {
            id: 0,
            form: {
                fileList: []
            },
            kdbInfo: [],
            
            imgBaseURL: import.meta.env.VITE_DOWNFILE_API_BASE_URL,
            
            VITE_UPLOAD_API_BASE_URL:import.meta.env.VITE_UPLOAD_API_BASE_URL,
        }
    },
    methods: {

        uploadFileSucess(response) {
            if (response.code != 200) {
                ElMessage.error('文档上传失败')
            } else {
                console.log(response)
                this.form.fileList = this.form.fileList.concat(response.data)
                this.getKDBInfo()
            }
        },
        async getKDBInfo() {

            let rs = await POST("/kdb/getKDBInfo", "POST", { id: this.id }, false)
            console.log("rs:>>:", rs)
            this.kdbInfo = rs.data

        }
    },
    mounted() {
        this.id = this.$route.params.id || 0
        console.log(this.id)
        this.getKDBInfo()
    }
}
</script>
<style></style>